<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<script>
  function appConfirm(price, clinicName,appointsId){
    var  labelHtml = '<a href="javascript:;" class="list-group-item">' +
    '<span class="badge bg-primary pull-right">' + parseFloat(price)+ '</span>' +
    '' + clinicName + '</a>';
    labelHtml += ' <a href="javascript:;" class="list-group-item" style="color: red">' +
    '支付方式' +
    '<span class="pull-right">' +
    '<select name="payType" id="payType" class="form-control" data-parsley-required="true">' +
    <c:forEach items="${fns:getDictList('PAY_WAY_DICT')}" var="type">
    <c:choose>
    <c:when test="${type.label=='现金支付'}">
    '<option value="${type.value}" selected="selected">${type.label}</option>' +
    </c:when>
    <c:otherwise>
    '<option value="${type.value}">${type.label}</option>' +
    </c:otherwise>
    </c:choose>
    </c:forEach>
    '</select>' +
    '</span>' +
    '</a>' +
    '<div class="list-group-item">' +
    '实收:' +
    '<input type="number" name="identity" id="costs" class="form-control" min=0 onMouseOut="theChange(' + price + ');" onBlur="theChange(' + price + ');"/>' +
    '找零:' +
    '<input name="identity" type="text" readonly="true" id="charges" class="form-control" onclick="theChange(' + price + ')"/>' +
    '</div>';
    $("#registInfo").html(labelHtml);
    var payType =$("#payType option:selected").val();
    register=layer.open({
      title: '预约结果',
      type: 1,
      area: ['30%', '60%'],
      content: $("#registInfo"),
      btn: ['确定', '取消'],
      yes: function (index, layero) {
        var costs = $("#costs").val();
        if (costs == '' || costs == 0) {
          toastr.warning("实收金额不能为空");
          return;
        }
        if (costs != null && costs != '') {
          if (costs < Number(price)) {
            toastr.warning("实收金额小于总价");
            return;
          }
        }
         ajaxData(appointsId,price,payType);
      }
    });
  }
  function ajaxData(appoints,price,payType){
    $.ajax({
       type:'post',
       url:'${ctx}/reg/clinicAppoints/confirmAppoints?id='+appoints+'&payType='+payType+'&clinicCharge='+price,
       success:function(data){
             if(data.code == 'success'){
                 toastr.success("确认成功");
                 layer.close(register);
                 $("#mainCenterDiv").load('${ctx}/reg/clinicAppoints/verifyIndex');
             }else{
                 toastr.warning("确认失败");
             }
       }
    });
  }
  function theChange(price) {
    var costs = $("#costs").val();
    costs=Number(costs);
    price=Number(price)
    if (costs != null && costs != '') {
      if (costs < price) {
        toastr.warning("实收金额小于总价");
        return;
      } else {
        $("#charges").val(Number(costs-price).toFixed(2));
      }
    }
  }
</script>
<div class="content-wrap">
  <div class="wrapper" style="bottom: 50px;">
    <ul class="nav nav-tabs">
      <li class="active">
        <a href="#"  onclick="loadDiv('mainCenterDiv','${ctx}/reg/clinicAppoints/verifyIndex')">预约列表</a>
      </li>
      <%--
      <li>
        <a href="#" onclick="loadDiv('mainCenterDiv','${ctx}/reg/clinicAppoints/appointsEditPage')">预约修改</a>
      </li>--%>
    </ul>
    <section class="panel panel-default">
      <div class="panel-body">
        <div class="table-responsive no-border">
          <div class="datatable-top">
            <div class="pull-left">
              <form:form id="searchForm"  modelAttribute="clinicAppoints"  onsubmit="return loadDivForm('mainCenterDiv','searchForm','${ctx}/reg/clinicAppoints/verifyIndex');" method="post" class="form-inline" style="padding-top: 10px;">
                就诊日期:<form:input path="visitDate" id="date"  class="form-control Wdate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:false});"/>
                身份证 ：<form:input path="idNo" id="clinicName"  class="form-control" />
                姓名 ：<form:input path="name"  id="deptId" style="width: 80px;" class="form-control" />&nbsp;&nbsp;
                <input id="search" class="btn btn-primary" type="submit" value="查询"/>&nbsp;&nbsp;
              </form:form>
            </div>
          </div>
          <table id="contentTable" class="table table-bordered mg-t datatable">
            <thead>
            <tr>
              <th>就诊日期</th>
              <th>就诊时间</th>
              <th>门诊号别</th>
              <th>姓名</th>
              <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <c:forEach items="${page.list}" var="appoints">
            <tr>
              <td> <fmt:formatDate value="${appoints.clinicForRegist.clinicDate}" pattern="yyyy-MM-dd"></fmt:formatDate></td>
              <td>${fns:getDictLabel(appoints.clinicForRegist.timeDesc, 'TIME_OF_DAY', '')}</td>
              <td> ${appoints.clinicIndex.name}</td>
              <td> ${appoints.name}</td>
              <td>
                <a href="#" onclick="appConfirm('${appoints.clinicForRegist.price}','${appoints.clinicIndex.name}','${appoints.id}')" class="btn btn-success btn-xs">确认</a>
                <a href="#" onclick="loadDiv('mainCenterDiv','${ctx}/reg/clinicAppoints/appointsEditPage?id=${appoints.id}')" class="btn btn-warning btn-xs">修改</a>
                <a href="#" onclick="confirmExtend('确认要退掉预约？',function(){delLoad('mainCenterDiv','${ctx}/reg/clinicAppoints/delete?id=${appoints.id}','${ctx}/reg/clinicAppoints/verifyIndex')})" class="applyBt btn btn-danger btn-xs">退约</a>
              </td>
            </tr>
            </c:forEach>
          </table>
          <div class="pagination">${page}</div>
        </div>
      </div>
    </section>
    <div id="registInfo" style="display: none">

    </div>
  </div>
</div>